<template>
	<div>
		<div class="navbar navbar-inverse navbar-fixed-top" id="navbar" role="banner" style="background-color:rgba(24, 24, 32);">
			<div class="container">
				<div class="navbar-header">
					<button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".zui-navbar-collapse">
						<span class="sr-only">切换导航</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<a href="/" class="navbar-brand">
						<span class="path-zui-36">
							<i class="path-1"></i>
							<i class="path-2"></i>
						</span>
						<span class="brand-title">黑马培训班</span>
						&nbsp;
						<i data-toggle="tooltip" id="compactTogger" data-placement="bottom" class="icon icon-home" data-original-title="" title=""></i>
					</a>
				</div>
				<nav class="collapse navbar-collapse zui-navbar-collapse">
					<ul class="nav navbar-nav navbar-right">
						<!-- <li id="navDownloadLink"> -->
							<!-- <span style="color:white;font-weight: bold;margin-right:50px;margin-top:500px">教师:{{$route.params.tcname}}</span> -->
							<!-- </li> -->
							<li id="navDownloadLink">
							<router-link to="login">
								<i class="icon icon-desktop"></i>
								<span>教师：{{this.$store.state.gamelist[0].name}}</span>
							</router-link>
						</li>
						
						<li id="navDownloadLink">
					<router-link to="/Detail">
								<i class="icon icon-desktop"></i>
								<span >详情</span>
							</router-link>
						</li>
					</ul>
				</nav>
			</div>
		</div>
		<!-- 登录 -->
		
	</div>
</template>

<script>
export default {
	name: 'Header',
	components: {},
	data() {
		return {
			count: 0,
			isShow: false,
			// 			showerror: false,
			// 			showlogname: false,
			usernameModel: '',
			pwdModel: ''
			// 			errorText: '',
			// 			userlogname: ''
		};
	},
	// 	computed: {
	// 		userErrors() {
	// 			let errorText, status;
	// 			if (!/@/g.test(this.usernameModel)) {
	// 				status = false;
	// 				errorText = '不包含@';
	// 			} else {
	// 				status = true;
	// 				errorText = '';
	// 			}
	// 			if (!this.uflag) {
	// 				(errorText = ''), (this.uflag = true);
	// 			}
	// 			return {
	// 				status,
	// 				errorText
	// 			};
	// 		},
	// 		pwdErrors() {
	// 			if (!/^\w{1,6}$/g.test(this.pwdModel)) {
	// 				status = false;
	// 				errorText = '密码不是1-6位';
	// 			} else {
	// 				status = true;
	// 				errorText = '';
	// 			}
	// 			if (!this.pflag) {
	// 				(errorText = ''), (this.pflag = true);
	// 			}
	// 			return {
	// 				status,
	// 				errorText
	// 			};
	// 		}
	// 	},
	methods: {
		onLogin() {
			// 			//console.log('dddd');
			// 			if (!this.userErrors.status || !this.pwdErrors.status) {
			// 				this.errorText = '部分选项没通过';
			// 				this.showerror = true;
			// 			} else {
			// 				this.errorText = '';
			// 				this.userlogname = this.usernameModel.split('@')[0];
			// 				this.showlogname = true;
			// 				this.showerror = false;
			// 			}
		},
		login() {
			console.log('dddd');
			this.isShow=true
		},
		logout(){
			this.isShow=false
		}
	}
};
</script>

<style scoped="scoped">
@import '../assets/css/zui.css';
.mask{
	width: 60%;
	padding-top: 20px;
	height: 220px;
	background-color:rgba(0,0,5,0.6);
	position: absolute;
	left: 20%;
	z-index: 99999;
	background-color:rgba(24, 24, 32, 0.267);
}
.btn-primary{
	position: relative;
	left:45%;
}
</style>
